<template>
	<view class="index">
		<view class="YongHu-XinXi">
			<view class="TouXiang">
				<view class="Zuo">
					<image
						:src="YongHu_XinXi ? YongHu_XinXi.data.detail.avatar : '/static/avatar.png'"
						mode="widthFix"></image>
				</view>
			</view>
			<view class="XinXi">
				<view class="JiBen">
					<view class="Zuo">
						<view>{{YongHu_XinXi ? YongHu_XinXi.data.detail.nickname : '未登录'}}</view>
						<text v-if="YongHu_XinXi">[{{YongHu_XinXi.data.detail.roleName}}]</text>
					</view>
					<view class="You" v-if="YongHu_TongJi_ShuJu">
						<view class="You-XunHuan">
							<view>帖子</view><view>{{YongHu_TongJi_ShuJu.postPublishCount}}</view>
						</view>
						<view class="You-XunHuan">
							<view>评论</view><view>{{YongHu_TongJi_ShuJu.commentPublishCount}}</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		
		<view class="Kuai">
			<view class="YR-UI-CaiDan-9">
				<view class="XunHuan" @click="$_TiaoZhuan('WoDe/WoDe_GeRen_ZiLiao','Token')">
					<view class="Zuo" style="background: #FFB300;"><text class="iconfont icon-user"></text></view>
					<view class="Zhong">个人资料</view>
					<view class="You"><text class="iconfont icon-arrow-right"></text></view>
				</view>
			</view>
		</view>
		<!-- <view class="Kuai">
			<view class="YR-UI-CaiDan-9">
				<view class="XunHuan" @click="$_TiaoZhuan('WoDe/WoDe_ShouJiHao','Token')">
					<view class="Zuo" style="background: #3EBBFD;"><text class="iconfont icon-shouji"></text></view>
					<view class="Zhong">手机绑定</view>
					<view class="You"><text class="iconfont icon-arrow-right"></text></view>
				</view>
				<view class="XunHuan" @click="$_TiaoZhuan('WoDe/WoDe_WeiXin','Token')">
					<view class="Zuo" style="background: #9DCA08;"><text class="iconfont icon-weixin"></text></view>
					<view class="Zhong">微信绑定</view>
					<view class="You"><text class="iconfont icon-arrow-right"></text></view>
				</view>
			</view>
		</view> -->
		<view class="Kuai">
			<!-- 菜单 | 9 -->
			<view class="YR-UI-CaiDan-9">
				<view class="XunHuan" @click="$_TiaoZhuan('_Z_GongYong/CaoGao_LieBiao','Token')">
					<view class="Zuo" style="background: #F37D7D;"><text class="iconfont icon-yingpingmoban"></text></view>
					<view class="Zhong">草稿列表</view>
					<view class="You">
						<template v-if="DangQian_CaoGao_ShuLiang">
							<text class="Zi">{{DangQian_CaoGao_ShuLiang}}</text>
						</template>
						<text class="iconfont icon-arrow-right"></text>
					</view>
				</view>
				<view class="XunHuan" @click="$_TiaoZhuan('WoDe/WoDe_TieZi','Token')">
					<view class="Zuo" style="background: #FFB300;"><text class="iconfont icon-bianji"></text></view>
					<view class="Zhong">我的发帖</view>
					<view class="You"><text class="iconfont icon-arrow-right"></text></view>
				</view>
				<view class="XunHuan" @click="$_TiaoZhuan('WoDe/WoDe_HuiFu','Token')">
					<view class="Zuo" style="background: #F37D7D;"><text class="iconfont icon-wode"></text></view>
					<view class="Zhong">我的回复</view>
					<view class="You"><text class="iconfont icon-arrow-right"></text></view>
				</view>
				<view class="XunHuan" @click="$_TiaoZhuan('WoDe/WoDe_ShouCang','Token')">
					<view class="Zuo" style="background: #9DCA08;"><text class="iconfont icon-shoucang"></text></view>
					<view class="Zhong">我的收藏</view>
					<view class="You"><text class="iconfont icon-arrow-right"></text></view>
				</view>
				<view class="XunHuan" @click="$_TiaoZhuan('WoDe/WoDe_GuanZhu','Token')">
					<view class="Zuo" style="background: #5c687e;"><text class="iconfont icon-yixiangkan"></text></view>
					<view class="Zhong">我的关注</view>
					<view class="You"><text class="iconfont icon-arrow-right"></text></view>
				</view>
			</view>
		</view>
		<view class="Kuai">
			<!-- 菜单 | 9 -->
			<view class="YR-UI-CaiDan-9">
				<view class="XunHuan" @click="$_TiaoZhuan('WoDe/WoDe_ZhuXiao','Token')">
					<view class="Zuo" style="background: #6600cc;"><text class="iconfont icon-lock"></text></view>
					<view class="Zhong">账号注销</view>
					<view class="You">
						<text class="iconfont icon-arrow-right"></text>
					</view>
				</view>
			</view>
		</view>
		<!-- #ifdef APP-PLUS -->
		<view class="Kuai">
			<!-- 菜单 | 9 -->
			<view class="YR-UI-CaiDan-9">
				<view class="XunHuan" @click="$_TiaoZhuan('WoDe/WoDe_App_GengXin')">
					<view class="Zuo" style="background: #a09989;"><text class="iconfont icon-fuzhi"></text></view>
					<view class="Zhong">APP更新</view>
					<view class="You">
						<text class="Zi" v-if="App_ShiFou_You_GengXin">有更新</text>
						<text class="iconfont icon-arrow-right"></text>
					</view>
				</view>
			</view>
		</view>
		<!-- #endif -->
		
		<view class="WeiBu-AnNiu" v-if="YongHu_XinXi">
			<view
				
				@click="DianJi_TuiChu"
				class="YR-UI-AnNiu-1"
				style="
					width: 200rpx;
					background: #F56C6C;
					color: #FFF;
				">退出</view>
		</view>
		
		<view class="WeiBu-AnNiu" v-else>
			<view
				@click="$_TiaoZhuan('WoDe/WoDe_DengLu')"
				class="YR-UI-AnNiu-1"
				style="
					width: 200rpx;
					background: #409EFF;
					color: #FFF;
				">登陆</view>
			<view
				@click="$_TiaoZhuan('WoDe/WoDe_ZhuCe')"
				class="YR-UI-AnNiu-1"
				style="width: 200rpx;background: #606266;color: #FFF;margin: 0 0 0 25rpx;">注册</view>
		</view>
			
			
			
		<view class="BanQuan">
			<view @click="$_TiaoZhuan('_Z_GongYong/JiShu_ZhiChi')">Powered by YouRanSNS for Fresns</view>
			<view @click="DianJi_QingKong_HuanCun">清空缓存</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				YongHu_XinXi:"",
				YongHu_TongJi_ShuJu:"",
				DangQian_CaoGao_ShuLiang:"",
				App_ShiFou_You_GengXin:false,
			}
		},
		onShow() {
			uni.getStorage({
				key: 'LinShiChuCun',
				success: (res) => {
					this.QingQiu_YongHuZiLiao();
					uni.removeStorage({ key: 'LinShiChuCun' });
				}
			});
			// 是否有消息
			setTimeout(()=>{this.$_ShiFou_You_XiaoXi()},100);
		},
		onLoad() {
			// #ifdef APP-PLUS
			this.QingQiu_BanBen_JianCe();
			// #endif
			if(uni.getStorageSync("YongHuXinXi")){
				this.QingQiu_YongHuZiLiao()
			}
		},
		methods: {
			QingQiu_YongHuZiLiao(){
				uni.request({
					url:this.$_URL() + "/api/v2/user/"+uni.getStorageSync("YongHuXinXi").data.detail.uid+"/detail",
					method:'GET',
					header:this.$_Fresns_Header(),
					success: (res) => {
						this.YongHu_XinXi = res.data;
						this.QingQiu_YongHu_TongJi_ShuJu()
					}
				})
			},
			// 版本检测
			QingQiu_BanBen_JianCe(){
				uni.request({
					url:this.$_PeiZhi_WenJian() + "App_GengXin.json",
					method:'GET',
					success: (res) => {
						let DangQian_BanBen = plus.runtime.version,
							ZuiXin_BanBen = res.data.ZuiXin_BanBen;
						if(DangQian_BanBen != ZuiXin_BanBen){
							this.App_ShiFou_You_GengXin = true
						}
					}
				})
			},
			QingQiu_YongHu_TongJi_ShuJu(){
				// 用户统计数据
				uni.request({
					url:this.$_URL() + "/api/v2/user/"+this.YongHu_XinXi.data.detail.username+"/detail",
					method:'GET',
					header:this.$_Fresns_Header(),
					success: (res) => {
						this.YongHu_TongJi_ShuJu = res.data.data.detail.stats;
					}
				})
				// 获取草稿数量
				uni.request({
					url:this.$_URL() + "/api/v2/editor/post/drafts",
					method:'GET',
					header:this.$_Fresns_Header(),
					success: (res) => {
						this.DangQian_CaoGao_ShuLiang = res.data.data.paginate.total;
					}
				})
			},
			DianJi_TuiChu(){
				uni.showModal({
					title: "提示",
					content: "是否要退出？",
					success: (res) => {
						if(res.confirm) {
							uni.request({
								url:this.$_URL() + "/api/v2/account/logout",
								method:'DELETE',
								header:this.$_Fresns_Header()
							})
							uni.removeStorageSync("ZhangHaoXinXi");
							uni.removeStorageSync("YongHuXinXi");
							this.YongHu_XinXi = uni.getStorageSync("YongHuXinXi");
							this.YongHu_TongJi_ShuJu = "";
							// #ifdef APP-PLUS
							plus.runtime.restart();
							// #endif
						}
					}
				});
			},
			DianJi_QingKong_HuanCun(){
				uni.showModal({
					title: "注意",
					content: "本地缓存数据将全部清空，非必要情况，请不要清空。",
					success: (res) => {
						if(res.confirm) {
							uni.request({
								url:this.$_URL() + "/api/v2/account/logout",
								method:'DELETE',
								header:this.$_Fresns_Header()
							})
							uni.clearStorage();
							this.YongHu_XinXi = uni.getStorageSync("YongHuXinXi");
							this.YongHu_TongJi_ShuJu = "";
							// #ifdef APP-PLUS
							plus.runtime.restart();
							// #endif
						}
					}
				});
			}
		}
	}
</script>

<style lang="scss">
page{background: $BeiJingSe;}
.index{
	.YR-UI-AnNiu-1{
		height: 70rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 10rpx;
	}
	.YR-UI-CaiDan-9{
		.XunHuan{
			padding: 25rpx;
			border-bottom: 1rpx solid $BianKuangSe;
			display: flex;
			align-items: center;
			.Zuo{
				flex-shrink: 0;
				width: 50rpx;
				height: 50rpx;
				overflow: hidden;
				border-radius: 100%;
				display: flex;
				align-items: center;
				justify-content: center;
				background: $LanSe;
				.iconfont{
					color: #FFF;
				}
			}
			.Zhong{
				flex: 1;
				margin: 0 15rpx;
			}
			.You{
				flex-shrink: 0;
				display: flex;
				align-items: center;
				.Zi{
					font-size: 18rpx;
					line-height: 18rpx;
					background: $HongSe;
					color: #FFF;
					padding: 10rpx 15rpx;
					border-radius: 100rpx;
					margin: 0 15rpx 0 0;
				}
				.icon-arrow-right{
					color: $ZhanWeiSe;
					font-size: 35rpx;
					line-height: 35rpx;
				}
			}
		}
	}
	.YongHu-XinXi{
		position: relative;
		margin: 75rpx 25rpx 0 25rpx;
		height: 140rpx;
		border-radius: 10rpx;
		background: #FFF;
		.TouXiang{
			display: flex;
			position: absolute;
			top: -50rpx;
			left: 25rpx;
			width: 675rpx;
			.Zuo{
				flex-shrink: 0;
				width: 100rpx;
				height: 100rpx;
				overflow: hidden;
				border-radius: 100%;
				image{
					display: block;
					width: 100%;
					height: auto;
				}
			}
		}
		.XinXi{
			width: 650rpx;
			position: absolute;
			top: 75rpx;
			left: 25rpx;
			.JiBen{
				width: 100%;
				display: flex;
				align-items: center;
				.Zuo{
					flex-shrink: 0;
					display: flex;
					align-items: center;
					line-height: 28rpx;
					view{
						line-height: 28rpx;
						margin: 0 10rpx 0 0;
					}
					text{
						font-size: 22rpx;
						line-height: 22rpx;
						color: $ZhanWeiSe;
					}
				}
				.You{
					flex: 1;
					display: flex;
					align-items: center;
					justify-content: flex-end;
					line-height: 28rpx;
					.You-XunHuan{
						border-right: 1rpx solid $BianKuangSe;
						padding: 0 15rpx 0 0;
						margin: 0 15rpx 0 0;
						view{
							font-size: 18rpx;
							line-height: 18rpx;
							color: $ZhanWeiSe;
							text-align: center;
						}
						view:nth-child(2){
							padding-top: 5rpx;
						}
					}
					.You-XunHuan:last-child{
						border-right: 0;
						margin-right: 0;
						padding-right: 0;
					}
				}
			}
		}
	}
	.Kuai{
		margin: 25rpx 25rpx 0 25rpx;
		background: #FFF;
		border-radius: 10rpx;
		.YR-UI-CaiDan-9{
			.XunHuan{
				border-bottom: 1rpx solid $BeiJingSe;
			}
			.XunHuan:last-child{
				border-bottom: 0;
			}
		}
	}
	.BanQuan{
		display: flex;
		align-items: center;
		justify-content: center;
		padding-bottom: 25rpx;
		view{
			font-size: 22rpx;
			line-height: 22rpx;
			color: $ZhanWeiSe;
			padding: 0 10rpx;
		}
	}
	.WeiBu-AnNiu{
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 25rpx 0;
	}
}
</style>